<div class="panel panel-default panel-intro">
    <div class="panel-heading">
        <h3 class="panel-title">工厂切换</h3>
    </div>
    <div class="panel-body">
        <div class="row">
            {foreach name="factories" item="factory"}
            <div class="col-md-4 col-sm-6">
                <div class="factory-card {if $factory.id == $currentFactoryId}active{/if}" data-factory-id="{$factory.id}">
                    <div class="card-header">
                        <h4>{$factory.name}</h4>
                        <span class="factory-code">{$factory.code}</span>
                    </div>
                    <div class="card-body">
                        <p><strong>地址：</strong>{$factory.address|default='未设置'}</p>
                        <p><strong>联系人：</strong>{$factory.contact_person|default='未设置'}</p>
                        <p><strong>电话：</strong>{$factory.contact_phone|default='未设置'}</p>
                    </div>
                    <div class="card-footer">
                        {if $factory.id == $currentFactoryId}
                        <span class="btn btn-success btn-sm disabled">当前工厂</span>
                        {else}
                        <button class="btn btn-primary btn-sm btn-switch" data-factory-id="{$factory.id}">切换到此工厂</button>
                        {/if}
                    </div>
                </div>
            </div>
            {/foreach}
        </div>
        
        {if empty($factories)}
        <div class="text-center">
            <div class="alert alert-warning">
                <h4>暂无可用工厂</h4>
                <p>您当前没有关联任何工厂，请联系管理员为您分配工厂权限。</p>
            </div>
        </div>
        {/if}
    </div>
</div>

<style>
.factory-card {
    border: 1px solid #ddd;
    border-radius: 5px;
    margin-bottom: 20px;
    transition: all 0.3s ease;
    background: #fff;
}

.factory-card:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}

.factory-card.active {
    border-color: #5cb85c;
    box-shadow: 0 2px 8px rgba(92,184,92,0.3);
}

.factory-card .card-header {
    background: #f5f5f5;
    padding: 15px;
    border-bottom: 1px solid #ddd;
    border-radius: 5px 5px 0 0;
}

.factory-card.active .card-header {
    background: #dff0d8;
}

.factory-card .card-header h4 {
    margin: 0;
    color: #333;
}

.factory-card .card-header .factory-code {
    color: #666;
    font-size: 12px;
}

.factory-card .card-body {
    padding: 15px;
}

.factory-card .card-body p {
    margin: 5px 0;
    font-size: 13px;
}

.factory-card .card-footer {
    padding: 10px 15px;
    background: #f9f9f9;
    border-top: 1px solid #ddd;
    border-radius: 0 0 5px 5px;
    text-align: center;
}

.factory-card.active .card-footer {
    background: #dff0d8;
}
</style>

<script>
$(function() {
    $('.btn-switch').on('click', function() {
        var factoryId = $(this).data('factory-id');
        var factoryCard = $(this).closest('.factory-card');
        
        Fast.api.ajax({
            url: 'scanwork/factory_switch/switch',
            data: {factory_id: factoryId}
        }, function(data, ret) {
            Toastr.success('工厂切换成功');
            // 更新界面
            $('.factory-card').removeClass('active');
            factoryCard.addClass('active');
            factoryCard.find('.btn-switch').removeClass('btn-primary').addClass('btn-success disabled').text('当前工厂');
            
            // 刷新页面或跳转
            setTimeout(function() {
                window.location.reload();
            }, 1000);
        });
    });
});
</script>
